<!DOCTYPE html>
<html lang="zh">
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>home_tool_bar--工具栏</title>
		<link rel="stylesheet" type="text/css" href="../css/base.css"/>
		<link rel="stylesheet" type="text/css" href="../css/bottom/home_tool_bar.css"/>

	</head>
	<body>
		<div class="home_tool_bar">
			<ul class="home_tool_bar_ul clearfix">
				<li class="home_tool_bar_li clearfix">
					<a class="home_tool_bar_a">
						<img class="home_tool_bar_img"
							src="https://i8.mifile.cn/b2c-mimall-media/98a23aae70f25798192693f21c4d4039.png" alt="">
						<img class="home_tool_bar_img_hover"
							src="https://i8.mifile.cn/b2c-mimall-media/74c4fcb4475af8308e9a670db9c01fdf.png" alt="">
						<p class="home_tool_bar_title">手机APP</p>
					</a>
					<div class="home_tool_bar_coder" onclick="alert(1)">
						<i class="home_tool_bar_coder_img"></i>
						<p class="home_tool_bar_coder_content">扫码领取新人百元礼包</p>
					</div>
				</li>
				<li class="home_tool_bar_li">
					<a class="home_tool_bar_a">
						<img alt="" class="home_tool_bar_img"
							src="https://i8.mifile.cn/b2c-mimall-media/55cad219421bee03a801775e7309b920.png">
						<img alt="" class="home_tool_bar_img_hover"
							src="https://i8.mifile.cn/b2c-mimall-media/41f858550f42eb1770b97faf219ae215.png">
						<p class="home_tool_bar_title">个人中心</p>
					</a>
				</li>
				<li class="home_tool_bar_li">
					<a class="home_tool_bar_a">
						<img alt="" class="home_tool_bar_img"
							src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/12eb0965ab33dc8e05870911b90f3f13.png">
						<img alt="" class="home_tool_bar_img_hover"
							src="https://cdn.cnbj1.fds.api.mi-img.com/mi-mall/95fbf0081a06eec7be4d35e277faeca0.png">
						<p class="home_tool_bar_title">售后服务</p>
					</a>
				</li>
				<li class="home_tool_bar_li">
					<a class="home_tool_bar_a">
						<img alt="" class="home_tool_bar_img"
							src="https://i8.mifile.cn/b2c-mimall-media/4f036ae4d45002b2a6fb6756cedebf02.png">
						<img alt="" class="home_tool_bar_img_hover"
							src="https://i8.mifile.cn/b2c-mimall-media/5e9f2b1b0da09ac3b3961378284ef2d4.png">
						<p class="home_tool_bar_title">人工客服</p>
					</a>
				</li>
				<li class="home_tool_bar_li">
					<a class="home_tool_bar_a">
						<img alt="" class="home_tool_bar_img"
							src="https://i8.mifile.cn/b2c-mimall-media/d7db56d1d850113f016c95e289e36efa.png">
						<img alt="" class="home_tool_bar_img_hover"
							src="https://i8.mifile.cn/b2c-mimall-media/692a6c3b0a93a24f74a29c0f9d68ec71.png">
						<p class="home_tool_bar_title">购物车</p>
					</a>
				</li>
				<li class="home_tool_bar_li back_to_top">
					<a class="home_tool_bar_a">
						<img alt="" class="home_tool_bar_img" src="https://i1.mifile.cn/f/i/2018/home/totop.png">
						<img alt="" class="home_tool_bar_img_hover"
							src="https://i1.mifile.cn/f/i/2018/home/totop_hover.png">
						<p class="home_tool_bar_title">回顶部</p>
					</a>
				</li>
			</ul>
		</div>
		<div style="height: 10000px;">

		</div>
	</body>
</html>

<script>
	(function() {
		var back_to_top = document.getElementsByClassName("back_to_top")[0];
		window.onload = scroll_top_change;
		window.onscroll = scroll_top_change;

		function scroll_top_change() {
			if (window.scrollY >= 900) {
				back_to_top.style.display = "block";
			} else {
				back_to_top.style.display = "none";
			}
		}
		var timer = "";
		back_to_top.onclick = function() {
			var y = 100;
			timer = setInterval(function() {
				document.documentElement.scrollTop -= y;
				y += 2;
				console.log(1);
				if (document.documentElement.scrollTop <= 10) {
					clearInterval(timer);
				}
			}, 20)
		}
	})()
</script>
